import React from 'react';
import ReactDOM from 'react-dom';

import { HashRouter,Route,Link,Switch,Redirect } from "react-router-dom";

import './components/main.css';

function Page01() {
    return <h1>页面内容一</h1>
}

function Page02() {
    return <h1>页面内容二</h1>
}

function Page03() {
    return (
        <div>
            <h2>新闻列表</h2>
            <ul>
                <li><Link to="/page03/detail/1001">新闻标题一</Link></li>
                <li><Link to="/page03/detail/1002">新闻标题二</Link></li>
                <li><Link to="/page03/detail/1003">新闻标题三</Link></li>
            </ul>
        </div>
    )
}

function Detail(props) {
    return <h2>这是新闻详情页面，新闻的id是：{props.match.params.newsId}</h2>
}

function NotFound() {
    return <h1>你要的页面未找到！</h1>
}

function App() {
    return (
        <HashRouter>
            <CustomLink label="页面一" to="/page01" />
            <CustomLink label="页面二" to="/page02" />
            <CustomLink label="页面三" to="/page03" exact={true} />
        </HashRouter>
    )
}
